<template>
<div>
    <div id="ajax-hook"></div>
    <div class="wrap">
        <div class="wpn">
            <div class="form-data pos">
                <a href=""><img src="../../assets/img/logo.png" class="head-logo"></a>
                <!--<p class="tel-warn hide"><i class="icon-warn"></i></p>-->
                <form>
                    <p class="p-input pos">
                        <label for="tel">手机号</label>
                        <input type="number" id="tel" autocomplete="off">
                        <span class="tel-warn tel-err hide"><em></em><i class="icon-warn"></i></span>
                    </p>
                    <p class="p-input pos" id="sendcode">
                        <label for="veri-code">输入验证码</label>
                        <input type="number" id="veri-code">
                        <a href="javascript:;" class="send">发送验证码</a>
                        <span class="time hide"><em>120</em>s</span>
                        <span class="error hide"><em></em><i class="icon-warn" style="margin-left: 5px"></i></span>
                    </p>
                    <p class="p-input pos hide" id="pwd">
                        <label for="passport">输入密码</label>
                        <input type="password" style="display: none"/>
                        <input type="password" id="passport">
                        <span class="tel-warn pwd-err hide"><em></em><i class="icon-warn" style="margin-left: 5px"></i></span>
                    </p>
                    <p class="p-input pos hide" id="confirmpwd">
                        <label for="passport2">确认密码</label>
                        <input type="password" style="position:absolute;top:-998px"/>
                        <input type="password" id="passport2">
                        <span class="tel-warn confirmpwd-err hide"><em></em><i class="icon-warn" style="margin-left: 5px"></i></span>
                    </p>
                </form>
                <!-- <div class="reg_checkboxline pos">
                    <span class="z"><i class="icon-ok-sign boxcol" nullmsg="请同意!"></i></span>
                    <input type="hidden" name="agree" value="1">
                    <div class="Validform_checktip"></div>
                    <p>我已阅读并接受 <a href="#" target="_brack">《保密协议说明》</a></p>
                </div> -->
                <button class="lang-btn">注册</button>
                <div class="bottom-info">已有账号，<a href="javascript:void(0);"  @click="skiplogin()" >马上登录</a></div>
                <div class="third-party">
                    <!-- <a href="#" class="log-qq icon-qq-round"></a>
                    <a href="#" class="log-qq icon-weixin"></a>
                    <a href="#" class="log-qq icon-sina1"></a> -->
                </div>
                <p class="right">Powered by © 2019</p>
            </div>
        </div>
    </div>
</div>
</template>



<script>
export default {
    
    methods:{
        boxcol(){
        $(".icon-ok-sign").click(function(){
            verify = $(this).hasClass('boxcol') ? 0 : 1;
            $(this).toggleClass('boxcol');
            ob = $('input[name=agree]');
            ob.val(ob.val()==0?1:0);
            ob.val(ob.val() !== verify ? verify : ob.val());

            ob.val() == 0 ? $('#errormsg').removeClass('hide').addClass('show') : $('#errormsg').removeClass('show').addClass('hide');
        });
        //输入框输入时模拟placeholder效果
        var oInput = $(".form-data input");
        oInput.focus(function () {
        $(this).siblings("label").hide();
        });
        oInput.blur(function () {
        if($(this).val()==""){
            $(this).siblings("label").show();
        }
        });
        // 输入框内容变化按钮颜色发生变化
        oInput.keyup(function () {
        if($(this).val()!="jquery.js"){
            $(".log-btn").removeClass("off")
        }else{
            $(".log-btn").addClass("off")
        }
        });
        },
        skiplogin() {
            this.$router.push({path: '/'});
        },
    },
    mounted(){
        this.boxcol();
    }

}
</script>

<style scoped>
    @import '../../assets/css/base.css';
    @import '../../assets/css/iconfont.css';
    @import '../../assets/css/reg.css';
</style>
 